@import "variables.less";

.form {
	.inp-grp {
		margin: 40px 0;
		position: relative;
		font-size: 16px;
		input {
			width: 100%;
			font-size: inherit;
			padding: 8px;
			background-color: transparent;
			border-width: 0 0 2px;
			border-color: @primary-blue-hover;
			outline: none;
		}
		.alert {
			color: @red-100;
			text-align: left;
			font-size: 14px;
			margin-top: 8px;
		}
		label {
			width: 100%;
			position: absolute;
			top: 0;
			left: 0;
			padding: 8px;
			text-align: left;
			z-index: -1;
		}
		input:focus {
			border-color: @primary-blue;
		}
		input:focus ~ label, input:valid ~ label {
			font-size: 14px;
			top: -30px;
			font-weight: 600;
		}
		textarea {
			width: 100%;
			height: 200px;
			border: 0;
			outline: 0;
			background-color: #FFFFFF;
			padding: 16px;
			font-size: inherit;
			&.hasError {
				color: @red-100;
			}
		}
	}
	.inp-btn-cnt {
		padding: 0;
		button {
			margin-right: 24px;
		}
	}
}
